<template>
  <div v-if="currentTime" class="system-time">
          <span class="day">{{ currentDay }}</span>
          <span class="time">{{ currentTime }}</span>
        </div>
</template>

<script setup>
/**
 * 当前系统时间
 */
 let currentTime = ref('');
let currentDay = ref('');
function updateCurrentTime() {
      setInterval(() => {
        const date = new Date(); // 创建Date对象表示当前日期和时间
        const hours = String(date.getHours()).padStart(2, '0'); // 格式化小时部分（至少两位）
        const minutes = String(date.getMinutes()).padStart(2, '0'); // 格式化分钟部分（至少两位）
        const seconds = String(date.getSeconds()).padStart(2, '0'); // 格式化秒钟部分（至少两位）
        const year = date.getFullYear();
        const month = date.getMonth()+1;
        const day = date.getDate();
       currentDay.value = `${year}-${month}-${day}`; // 设置currentTime为格式化后的时间字符串
       currentTime.value = `${hours}:${minutes}:${seconds}`;
      }, 1000); // 每隔1秒更新一次时间
    }
updateCurrentTime();


</script>

<style lang="scss">
.day{
  margin-right:12px;
}
.system-time{
  margin-right:36px;
  font-weight: 500;
}

</style>
